﻿@model LeadMaster.ViewModels.ViewModelEnquiry

@using (Ajax.BeginForm(
    "Create", "Enquiry", null,
    new AjaxOptions
    {
        HttpMethod = "Post"
    }, new { @id="formCreateEnquiry"}))
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Note Entry for @Model.Lead.Company.Company</legend>
        @Html.HiddenFor(model => model.Enquiry.UserID)
        @Html.HiddenFor(model => model.Enquiry.LeadID)
        @Html.HiddenFor(model => model.Enquiry.CompanyID)
        @Html.HiddenFor(model => model.Enquiry.EnquirySource)

        <table class="formtable" cellspacing="0" cellpadding="0">
        <tr style="vertical-align: middle" valign="middle">
        <th style="width: 100px; vertical-align:middle; text-align: left;">
            @Html.LabelFor(model => model.Enquiry.ContactID, "Contact", new { style = "vertical-align:middle;" })
        </th>
        <td style="vertical-align: middle; padding-top: 10px;">
            @Html.DropDownListFor(model => model.Enquiry.ContactID, new SelectList(Model.ContactsList, "Value", "Text", Model.Enquiry.ContactID), new { @Class = "chosen-select", style = "width: 250px;" })
            @Html.ValidationMessageFor(model => model.Enquiry.ContactID)
        </td>
        </tr>
        <tr>
        <th style="width: 100px; vertical-align:middle; text-align: left;">
            @Html.LabelFor(model => model.Enquiry.EnquirySource)
        </th>
        <td style="vertical-align: middle; padding-top: 15px; text-align: left;">
             <table>
                <tr>
                <td><img src="../../Images/phone_icon.png" style="height:40px; width: 40px;" id="imgCommsPhone" class="commsbutton" alt="Phone"/></td>
                <td><img src="../../Images/email_icon.png"  style="height:40px; width: 40px;" id="imgCommsEmail" class="commsbutton" alt="Email"/></td>
                <td><img src="../../Images/two_people_meeting.png"  style="height:40px; width: 40px;" id="imgCommsMeeting" class="commsbutton" alt="Meeting"/></td>
                <td><img src="../../Images/fax_icon2.jpg"  style="height:40px; width: 40px;" id="imgCommsFax" class="commsbutton" alt="Fax"/></td></tr>
            </table>
            @Html.ValidationMessageFor(model => model.Enquiry.EnquirySource)
        </td>
        </tr>
        <tr>
            <th style="width: 100px; vertical-align:middle; text-align: left;">
                @Html.LabelFor(model => model.Enquiry.EnquiryDate)
            </th>
            <td  style="vertical-align: middle; padding-top: 12px;">
                @Html.TextBoxFor(model => model.EnquiryHoldingDate, new { style = "width: 80px;" }):
                @Html.TextBoxFor(model => model.EnquiryHoldingTime, new { style = "width: 50px;" })
                @Html.ValidationMessageFor(model => model.Enquiry.EnquiryDate)
            </td>
        </tr>
        <tr>
        <th style="width: 100px; vertical-align:middle; text-align: left;">
            @Html.LabelFor(model => model.Enquiry.Notes)
        </th>
        <td>
            @Html.TextAreaFor(model => model.Enquiry.Notes, new { @class = "reportbox" })
            @Html.ValidationMessageFor(model => model.Enquiry.Notes)
        </td>
        </tr>
        </table>
        <div style="margin-top: 20px;float:right">
        <input type="button" value="Save" class="bigsubmit" id="enquirysubmit"/>
         </div> 
    </fieldset>
}


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}


<script type="text/javascript">
    $(document).ready(function () {

        $(".chosen-select2").chosen();

        var currentDate = new Date();
        $("#imgCommsPhone").css("border-style", "solid");
        $("#Enquiry_EnquirySource").val("T");
        $("#EnquiryHoldingTime").val(currentDate.getHours() + ":" + currentDate.getMinutes());
        jQuery(function ($) {
            $("#EnquiryHoldingTime").mask("99:99");
        });

        $("#EnquiryHoldingDate").datepicker({
            changeMonth: true,
            changeYear: true,
            regional: 'en-GB',
            dateFormat: 'dd/mm/yy'
        });


        $("#EnquiryTypeID").attr('name', 'Enquiry.EnquiryTypeID');
        $("#EnquiryTypeID").val("@(Model.Enquiry.EnquiryTypeID)");

        $("#Enquiry_Notes").blur(function() {
            var changeText;
            var stringChars="<>";
            var currentSeachChar;
            for (var i = 0; i <= stringChars.length; i++) {
                currentSeachChar=stringChars.substring(i,1);
                while ($(this).val().indexOf(currentSeachChar)>0) {
                    changeText=$(this).val().replace(currentSeachChar,'');
                    $(this).val(changeText);
                }
            }
        });

 
        $("#enquirysubmit").click(function () {
            $('#formCreateEnquiry').submit();
            var loadUrl='@(Url.Action("Index", "Enquiry"))/?id=' + @(Model.Enquiry.LeadID);
            var newRow="<tr id='newfirstrow'><td class='TableCell'>" + $("#Enquiry_ContactID option:selected").text() + "</td>";
            newRow+="<td class='TableCell'>" + $('#EnquiryHoldingDate').val().toString() + $('#EnquiryHoldingTime').val().toString() + "</td>";
            switch ($("#Enquiry_EnquirySource").val()) 
            {
            case 'T':
            newRow+="<td class='TableCell'>Telephone</td>";
            break;
            case 'E':
            newRow+="<td class='TableCell'>Email</td>";
            break;
            case 'M':
            newRow+="<td class='TableCell'>Meeting</td>";
            break;
            case 'F':
            newRow+="<td class='TableCell'>Fax</td>";
            break;
            case 'W':
            newRow+="<td class='TableCell'>WWW</td>";
            break;
            default:
            }
            newRow+="<td class='TableCell'><textarea class='commsnotes' cols='20' rows='2'>" + $("#Enquiry_Notes").val() + "</textarea></td>";
            newRow+="</tr>";
            $(newRow).insertBefore($('#firstrow'));
            $("#firstrow").removeAttr("id");
            $("#newfirstrow").attr("id","firstrow");
            $('#createenquirydialog').dialog('close');
        });

        $(".commsbutton").click(function () {
            $("#imgCommsPhone").css("border-style", this.id == "imgCommsPhone" ? "solid" : "none");
            $("#imgCommsEmail").css("border-style", this.id == "imgCommsEmail" ? "solid" : "none");
            $("#imgCommsMeeting").css("border-style", this.id == "imgCommsMeeting" ? "solid" : "none");
            $("#imgCommsFax").css("border-style", this.id == "imgCommsFax" ? "solid" : "none");
            switch (this.id) {
                case "imgCommsPhone":
                    $("#Enquiry_EnquirySource").val("T");
                    break;
                case "imgCommsEmail":
                    $("#Enquiry_EnquirySource").val("E");
                    break;
                case "imgCommsMeeting":
                    $("#Enquiry_EnquirySource").val("M");
                    break;
                case "imgCommsFax":
                    $("#Enquiry_EnquirySource").val("F");
                    break;
                default:
            }
        });

    });
</script>

